<?php if (!defined('THINK_PATH')) exit();?>

<link rel="stylesheet" href="/125/zj125/Public/Home/register.css" type="text/css">
<script src="/125/zj125/Public/Home/jquery.js"></script>
<script>
    $(function(){
        var ok1=false;
        var ok2=false;
        var ok3=false;
        var ok4=false;
        var ok5=false;
        var ok6=false;
		var ok7=false;
        // 验证用户名
        $('.uname').focus(function(){
            $(this).next().text('用户名应该为3-12位之间').removeClass('state1').addClass('state2');
        }).blur(function(){
            if($(this).val().length >= 3 && $(this).val().length <=12 && $(this).val()!=''){
        // 验证用户名存在
                var uname = $(this).val();
                $.get('<?php echo U("checkName");?>',{uname:uname},function(data){ 
                    if(data.status==false){                       
                        $('#checkname1').text(data.msg).removeClass().addClass('state3');
                        return;
                    }else{
                        $('#checkname1').text('输入成功').removeClass().addClass('state4');
                        ok1=true;                
                    }
               },'json');    
            }else{
                $(this).next().text('用户名应该为3-12位之间').removeClass().addClass('state3');
            }             
        });
        //验证密码
        $('.pwd').focus(function(){
            $(this).next().text('6-18位字母数字').removeClass().addClass('state2');
        }).blur(function(){
            if($(this).val().length >= 6 && $(this).val().length <=18 && $(this).val()!=''){
                $(this).next().text('输入成功').removeClass().addClass('state4');
                ok2=true;
            }else{
                $(this).next().text('6-18位字母数字').removeClass().addClass('state3');
            }
             
        });

        //验证确认密码
            $('.pwd2').focus(function(){
            $(this).next().text('请保持密码一致').removeClass().addClass('state2');
        }).blur(function(){
            if($(this).val().length >= 6 && $(this).val().length <=18 && $(this).val()!='' && $(this).val() == $('input[name="pwd"]').val()){
                $(this).next().text('输入成功').removeClass().addClass('state4');
                ok3=true;
            }else{
                $(this).next().text('请保持密码一致').removeClass().addClass('state3');
            }
             
        });

        //验证邮箱
        $('.email').focus(function(){
            $(this).next().text('请输入正确的EMAIL格式').removeClass().addClass('state2');
        }).blur(function(){
            if($(this).val().search(/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/)==-1){
                $(this).next().text('请输入正确的EMAIL格式').removeClass().addClass('state3');
            }else{                  
                $(this).next().text('输入成功').removeClass().addClass('state4');
                ok4=true;
            }  
        });

        //验证手机
        $('.tel').focus(function(){
            $(this).next().text('请输入正确的手机格式').removeClass().addClass('state2');
        }).blur(function(){
            if($(this).val().search(/^1[3|4|5|7|8]\d{9}$/)==-1){
                $(this).next().text('请输入正确的手机格式').removeClass().addClass('state3');
            }else{                  
                $(this).next().text('输入成功').removeClass().addClass('state4');
                ok5=true;
            }  
        });

     //验证验证码
            $('input[name="code"]').focus(function(){
                $('#checkcode1').text('请输入验证码').removeClass().addClass('state2');
            }).blur(function(){
                //console.log('haqweqweha');
                if($('input[name="code"]').val().length==3){
                    var code = $(this).val();
                    $.get('<?php echo U("checkcode");?>',{code:code},function(data){ 
                        //console.log('hahahhaha');
                            if(data.status==false){                       
                                $('#checkcode1').text(data.msg).removeClass().addClass('state3');
                                return;
                            }else{
                                $('#checkcode1').text('验证成功').removeClass().addClass('state4');
                                ok6=true;                
                            }
                       },'json'); 
                }else{
                    $(this).next().next().text('请输入验证码').removeClass().addClass('state3');
                }
            });
		//验证协议
		

        //提交按钮,所有验证通过方可提交
        $('.submit').click(function(){
            if(ok1 && ok2 && ok3 && ok4 && ok5 && ok6 && ok7){
                $('#frm').submit();
            }else{
                alert("请填写完整信息");
                return false;
            }
        });
         
    });
</script>

<body style="background:url('/125/zj125/Public/2.jpg')repeat 0px 0px;">
	<div style="border:1px solid black;width:480px;height:390px;margin-left:220px;margin-top:30px;background:url('/125/zj125/Public/1.jpg')repeat 0px 0px;">
	<form action="<?php echo U('doRegister');?>" method="post" enctype="multipart/form-data" id="frm" >
	<div class='zc'><font size=5>用户注册</font></div>
	<table id='body' cellspacing=10px cellpadding=1px>
		<tr>
			<th><font size=1 color="red">* </font>用户名</th>
			<td><input type='text' name='uname' class="uname"><span id="checkname1" class='state1'>请输入用户名</span></td>
		</tr>
		<tr>
			<th><font size=1 color="red">* </font>密码</th>
			<td><input type='password' name='pwd' class="pwd"><span class='state1'>请输入密码</span></td>
		</tr>
		<tr>
			<th><font size=1 color="red">* </font>确认密码</th>
			<td><input type='password' name='pwd2' class="pwd2"><span class='state1'>请再次输入密码</span></td>
		</tr>
		<tr>
			<th><font size=1 color="red">* </font>性别</th>
			<td><input type='radio' name='sex' value=1 checked>男 <input type='radio' name='sex' value=0>女</td>
		</tr>
		<tr>
			<th><font size=1 color="red">* </font>邮箱</th>
			<td><input type='text' name='email' class="email"><span class='state1'>请输入邮箱</span></td>
		</tr>
		<tr>
			<th><font size=1 color="red">* </font>电话</th>
			<td><input type='text' name='tel' class="tel"><span class='state1'>请输入手机号码</span></td>
		</tr>
		<tr>
			<th><font size=1 color="red">* </font>头像</th>
			<td><input type='file' name='photo' ></td>
		</tr>
		<tr>
			<th><font size=1 color="red">* </font>验证码</th>
			<td><input type='text' style="width:70px;" name='code' id="code" class="code">
				<img style="width:80px;height:20px" onclick="this.src='<?php echo U('/Home/User/verify');?>?'+Math.random()" src="<?php echo U('/Home/User/verify');?>">	
				<span id="checkcode1" class='state1'>请输入验证码</span>	
			</td>
		</tr>
		<tr>
		    <td></td>
		    <td colspan=2><input class='server' type="checkbox" name="list" value=1 style="display:inline-block;" checked><font size=2>接受</font><a href="./server.html" target="_blank" style="text-decoration:none"><font size=2 color="blue">《商城服务条款》</font></a>
		</tr>
		<tr> 
			<td colspan=2><input type="button" style="width:170px;height:24px;margin-left:86px;background:red;color:white;" class="submit" value="提交" ></td>
		</tr>
	</table>
	</form>
	</div>
</body>